<template>
  <div class="dialog-form">
    <el-form :model="form" :rules="rules" ref="channelKeysConfigRef" label-width="110px">
      <el-row :gutter="36">
        <el-col :span="12">
          <el-form-item label="码方案" prop="codeId">
            <el-select v-model="form.codeId" placeholder="请选择">
              <el-option
                v-for="item in codeList"
                :key="item.id"
                :label="item.codeName"
                :value="item.id"
                :disabled="item.enabled == 2"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="拉码类型" prop="qrcodeType">
            <el-radio-group v-model="form.qrcodeType">
              <el-radio
                v-for="dict in pull_code_type"
                :key="dict.value"
                :value="Number(dict.value)"
              >{{ dict.label }}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="加密方式" prop="encryptType">
            <el-radio-group v-model="form.encryptType">
              <el-radio
                v-for="dict in bus_encryption_type"
                :key="dict.value"
                :value="Number(dict.value)"
              >{{ dict.label }}
              </el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <div class="key-box">
          <el-col v-if="form.channelType == 1016" :span="24">
            <div class="flex">
              <div class="label-box">
                <p class="asterisk">*</p>
                <el-tooltip
                  content="用于机具上传订单验签公钥，由发码平台提供给机具"
                  placement="top-start"
                >
                  <el-icon :size="12" color="#8E8E8E">
                    <QuestionFilled />
                  </el-icon>
                </el-tooltip>
                <p class="title">机具验签公钥</p>
              </div>
              <el-form-item class="flex-1" label="" prop="machinePublicKey" label-width="0">
                <el-input type="textarea" v-model="form.machinePublicKey" placeholder="用于机具上传订单验签公钥，由发码平台提供给机具" rows="4" />
              </el-form-item>
            </div>
          </el-col>
          <el-col v-if="form.channelType != 1016" :span="24">
            <div class="flex">
              <div class="label-box">
                <p class="asterisk">*</p>
                <el-tooltip
                  content="用于渠道方调用发码平台接口，由发码平台向渠道提供验签公钥"
                  placement="top-start"
                >
                  <el-icon :size="12" color="#8E8E8E">
                    <QuestionFilled />
                  </el-icon>
                </el-tooltip>
                <p class="title">验签公钥</p>
              </div>
              <el-form-item v-if="form.encryptType == 1" class="flex-1" label="" prop="rsaSignPublicKey" label-width="0">
                <el-input type="textarea" v-model="form.rsaSignPublicKey" placeholder="用于渠道方调用发码平台接口，由发码平台向渠道提供验签公钥" rows="4" />
              </el-form-item>
              <el-form-item v-if="form.encryptType == 2" class="flex-1" label="" prop="sm2SignPublicKey" label-width="0">
                <el-input type="textarea" v-model="form.sm2SignPublicKey" placeholder="用于渠道方调用发码平台接口，由发码平台向渠道提供验签公钥" rows="4" />
              </el-form-item>
            </div>
          </el-col>
          <el-col v-if="form.channelType != 1016" :span="24">
            <div class="flex">
              <div class="label-box">
                <p class="asterisk">*</p>
                <el-tooltip
                  content="用于渠道方调用发码平台接口，由发码平台对接口参数进行验签"
                  placement="top-start"
                >
                  <el-icon :size="12" color="#8E8E8E">
                    <QuestionFilled />
                  </el-icon>
                </el-tooltip>
                <p class="title">验签私钥</p>
              </div>
              <el-form-item v-if="form.encryptType == 1" class="flex-1" label="" prop="rsaSignPrivateKey" label-width="0">
                <el-input type="textarea" v-model="form.rsaSignPrivateKey" placeholder="用于渠道方调用发码平台接口，由发码平台对接口参数进行验签" rows="4" />
              </el-form-item>
              <el-form-item v-if="form.encryptType == 2" class="flex-1" label="" prop="sm2SignPrivateKey" label-width="0">
                <el-input type="textarea" v-model="form.sm2SignPrivateKey" placeholder="用于渠道方调用发码平台接口，由发码平台对接口参数进行验签" rows="4" />
              </el-form-item>
            </div>
          </el-col>
          <el-button 
            v-if="form.channelType != 1016" 
            type="primary" size="small" 
            class="generate" 
            @click="secretGenerate">
            生成公私钥对
          </el-button>
        </div>
        
        <!-- <div class="key-box third-key" v-if="form.channelType != 1016">
          <el-col :span="24">
            <div class="flex">
              <div class="label-box">
                <p class="asterisk">*</p>
                <el-tooltip
                  content="用于应用渠道拉码，由应用渠道方提供给发码平台"
                  placement="top-start"
                >
                  <el-icon :size="12" color="#8E8E8E">
                    <QuestionFilled />
                  </el-icon>
                </el-tooltip>
                <p class="title">第三方拉码验签公钥</p>
              </div>
              <el-form-item class="flex-1" label="" prop="thirdPublicKey" label-width="0">
                <el-input type="textarea" v-model="form.thirdPublicKey" placeholder="用于应用渠道拉码，由应用渠道方提供给发码平台" rows="4" />
              </el-form-item>
            </div>
          </el-col>
        </div> -->

        <el-col :span="24">
          <el-form-item label="备注" prop="remark">
            <el-input v-model="form.remark" type="textarea" placeholder="请输入备注" :rows="5" :maxlength="100" show-word-limit></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="dialog-footer">
      <el-button @click="onCancel">取消</el-button>
      <el-button type="primary" @click="onConfirm">确认</el-button>
    </div>
  </div>
</template>

<script setup>
import { listPlatCodeManagement } from "@/api/bus/platCodeManagement"
import { getChannel, updateChannel, sm2SecretGenerate, rsaSecretGenerate} from "@/api/channel/platchannelinfo"

const { proxy } = getCurrentInstance()
const { pull_code_type, bus_encryption_type } = proxy.useDict('pull_code_type', 'bus_encryption_type')

const emits = defineEmits(['cancel', 'confirm'])

const channelKeysConfigRef = ref()
const codeList = ref("")
const form = ref({
  id: null,
  codeId: null,
  remark: null,
  qrcodeType: null,
  thirdPublicKey: null,
  machinePublicKey: null,
  encryptType: null,
  configKey: null,
  rsaSignPublicKey: null,
  rsaSignPrivateKey: null,
  sm2SignPublicKey: null,
  sm2SignPrivateKey: null,
})
const rules = {
  codeId: [
    { required: true, message: "码方案没有选择", trigger: "blur" }
  ],
  encryptType: [
    { required: true, message: "加密方式没有选择", trigger: "blur" }
  ],
  qrcodeType: [
    { required: true, message: "拉码类型没有选择", trigger: "blur" }
  ],
  machinePublicKey: [
    { required: true, message: "机具验签公钥不能为空", trigger: "blur" }
  ],
  rsaSignPublicKey: [
    { required: true, message: "接口验签公钥不能为空", trigger: "blur" }
  ],
  sm2SignPublicKey: [
    { required: true, message: "接口验签公钥不能为空", trigger: "blur" }
  ],
  rsaSignPrivateKey: [
    { required: true, message: "机具验签私钥不能为空", trigger: "blur" }
  ],
  sm2SignPrivateKey: [
    { required: true, message: "机具验签私钥不能为空", trigger: "blur" }
  ],
}

const pageInit = (id) => {
  let query = {
    pageNum: 1,
    pageSize: 1000,
  }
  listPlatCodeManagement(query).then(response => {
    codeList.value = response.rows
  })
  getChannel(id).then(response => {
    form.value = response.data
    if (!form.value.qrcodeType) {
      form.value.qrcodeType = 1
    }
    if (!form.value.encryptType) {
      form.value.encryptType = 2
    } else if (form.value.encryptType == 1) {
      form.value.rsaSignPublicKey = response.data.signPublicKey
      form.value.rsaSignPrivateKey = response.data.signPrivateKey
    } else if (form.value.encryptType == 2) {
      form.value.sm2SignPublicKey = response.data.signPublicKey
      form.value.sm2SignPrivateKey = response.data.signPrivateKey
    }
    if (form.value.codeId == 0) {
      form.value.codeId = null
    }
  })
}

function secretGenerate(){
  if (form.value.encryptType == 2) { //sm2
    sm2SecretGenerate().then(response => {
      form.value.sm2SignPublicKey = response.data.publicKey
      form.value.sm2SignPrivateKey = response.data.privateKey
    })
  }
  if (form.value.encryptType == 1) { //rsa
    rsaSecretGenerate().then(response => {
      form.value.rsaSignPublicKey = response.data.publicKey
      form.value.rsaSignPrivateKey = response.data.privateKey
    })
  }

}

const onCancel = () => {
  emits('cancel')
}

const onConfirm = () => {
  channelKeysConfigRef.value.validate(valid => {
    if (valid) {
      form.value.configKey = 1
      form.value.signPublicKey = form.value.encryptType == 1 ? form.value.rsaSignPublicKey : form.value.sm2SignPublicKey
      form.value.signPrivateKey = form.value.encryptType == 1 ? form.value.rsaSignPrivateKey : form.value.sm2SignPrivateKey
      updateChannel(form.value).then(response => {
        proxy.$modal.msgSuccess("修改成功")
        channelKeysConfigRef.value.resetFields()
        emits('confirm')
      })
    }
  })
}

defineExpose({
  pageInit
})

</script>

<style lang="scss" scoped>
.key-box {
  width: 100%;
  padding: 10px 0;
  margin: 0 20px 20px;
  box-sizing: border-box;
  border: 1px dashed rgb(43, 84, 239);
  border-radius: 4px;
  background: rgb(232, 243, 255);

  .el-col {
    padding-left: 0 !important;
  }
}

.third-key {
  padding-bottom: 0;

  .el-form-item {
    margin-bottom: 10px;
  }
}

.label-box {
  display: flex;
  align-items: baseline;
  width: 105px;
  .title {
    color: rgb(75, 75, 75);
    padding-left: 3px;
  }

  .asterisk {
    color: #f56c6c;
    margin: 0 5px;
  }
}

.generate {
  width: 80%;
  margin-left: 10%;
  margin-bottom: 10px;
}

</style>